<template>
  <div>
    <!-- <img class="login_bg" src="@/assets/img/loginbg.png" alt /> -->

    <!--  -->
    <div class="logo">
      <img class="login_logo" src="@/assets/img/loginlogo.png" alt />
      <div class="padding-lr40 padding-tb20">
        <div class="rem-30px flex align-center padding-tb30 border-bottom">
          <div class="c-99 w-90 text-justify word-all margin-r24">账号</div>
          <div class="flex-grow">
            <input type="text" name="phone" maxlength="11" v-model="phone" placeholder="请输入账号" />
          </div>
        </div>
        <div class="rem-30px flex align-center padding-tb30 border-bottom">
          <div class="c-99 w-90 text-justify word-all margin-r24">密码</div>
          <div class="flex-grow">
            <input type="password" name="password" v-model="password" placeholder="请输入密码" />
          </div>
        </div>
        <!--  -->
        <!-- 找回密码 -->
        <!-- <div class="text-33 rem-26px margin-tb50" @click="$router.push({name: 'loginFhtml'})">找回密码</div> -->
        <!--  -->
        <div class="margin-t40">
          <div class="sure text-center bg-ff0 text-ff" @click="login">登录</div>
        </div>
      </div>
    </div>

    <div class="html"></div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      phone: "",
      password: ""
    };
  },
  mounted() {
    if (window.localStorage.getItem("qx_token")) {
      this.$router.push({
        path: "/mine/"
      });
    }
  },
  methods: {
    getList(e) {
      if (e == 1) {
        this.$router.push({
          path: "/loginFhtml"
        });
      }
    },
    login() {
      if (!this.phone || !this.password) {
        this.$toast("信息不能为空");
        return false;
      }
      if (!this.phone || !/^1[3456789]\d{9}$/.test(this.phone)) {
        this.$toast("手机号码格式有误");
        return false;
      }
      this.$axios
        .post("/home/login/phone_password", {
          phone: this.phone,
          password: this.password
        })
        .then(res => {
          if (res.data.code == 0) {
            localStorage.setItem("qx_token", res.data.data.token);
            localStorage.setItem("qx_id", res.data.data.e_id);
            localStorage.setItem("qx_phone", this.phone_qx);
            localStorage.setItem("is_perfect", res.data.data.is_perfect);
            this.$router.push({
              path: "/mine"
            });
          }
        });
    }
  }
};
</script>


<style>
.logo ._tab_cur {
  color: #333;
}
</style>
<style scoped>
.html {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  background-image: url("../assets/img/loginbg.png");
  background-repeat: no-repeat;
  background-color: white;
  background-size: 100%;
  background-position: left bottom;
}
.login_bg {
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  display: block;
}
.login_logo {
  /* width: 2.7rem;
  height: 0.84rem; */
  max-width: 100%;
  margin: 1rem auto 0.8rem;
}
.w-90 {
  width: 0.9rem;
}
.padding-lr28 {
  padding: 0 0.28rem;
}
</style>